<script setup>
import topNav from "../../components/topNav.vue";
import { onMounted, reactive, ref, getCurrentInstance, computed } from "vue";
import { onLoad, onReachBottom, onShow } from "@dcloudio/uni-app";
import { appProductDetail, queryOfferPrices } from "@/services/goods";
// import {
//   productOfferPrice,
//   commonProduct,
//   LmyOfferPriceList,
// } from "@/services/goods";
const id = ref("");
const productDet = ref({});
const productId = ref("");
const offerPricesList = ref([]);

onLoad((options) => {
  console.log(options);

  if (options.id) {
    id.value = options.id;
    getProduceDet();
    getQueryOfferPrices();
    // getproductOfferPrice();
    // getCommonProduct();
    // getLmyOfferPriceList();
  }
});

const offerPricesSort = ref([]);
//商品详情
const getQueryOfferPrices = async () => {
  console.log(id.value);
  try {
    let res = await queryOfferPrices({ productId: id.value });
    if (res.code == 200) {
      // productDet.value = res.data;
      offerPricesList.value = res.data;
      let arr = JSON.parse(JSON.stringify(res.data));

      offerPricesSort.value = arr.sort(function (a, b) {
        console.log(a.offerPrice, b.offerPrice);
        return a.offerPrice - b.offerPrice;
      });
    } else {
      uni.showToast({
        title: res.msg,
        icon: "none",
      });
    }
  } catch (e) {
    uni.showToast({
      title: e.msg,
      icon: "none",
    });
  }
};

//商品详情
const getProduceDet = async () => {
  console.log(id.value);
  try {
    let res = await appProductDetail({ id: id.value });
    if (res.code == 200) {
      productDet.value = res.data;
    } else {
      uni.showToast({
        title: res.msg,
        icon: "none",
      });
    }
  } catch (e) {
    uni.showToast({
      title: e.msg,
      icon: "none",
    });
  }
};
const getCommonProduct = async () => {
  console.log(id.value);
  try {
    let res = await commonProduct({ id: productId.value });
    console.log(res);
    productDet.value = res.data;
  } catch (e) {
    uni.showToast({
      title: e.message,
      icon: "none",
    });
  }
};

const productList = ref([]);

const getLmyOfferPriceList = async () => {
  try {
    let res = await LmyOfferPriceList({ productId: productId.value });
    console.log(res);
    // productDet.value = res.data;
    productList.value = res.data.datas;
  } catch (e) {
    uni.showToast({
      title: e.message,
      icon: "none",
    });
  }
};

const showWLFun = () => {
  uni.navigateTo({
    url:
      "/pages/quotation/add/index?id=" +
      productDet.value.id +
      "&offerPrice=" +
      productList.value[0].offerPrice +
      "&reId=" +
      productList.value[0].id,
  });
};

//无网状态
const connected = () => {
  getProduceDet();
  getQueryOfferPrices();
};
</script>

<template>
  <topNav
    title="商品报价"
    @search="searchFun"
    @scan="scanFun"
    rType="save"
    :clickable="false"
  ></topNav>

  <view class="content">
    <view class="content-k">
      <view class="content-item">
        <view class="left">商品名称</view>
        <view class="right">
          <text>{{ productDet.name }}</text>
        </view>
      </view>
      <view class="content-item">
        <view class="left">商品主图</view>
        <view class="right">
          <image
            :src="
              productDet.image ||
              'https://cloud-erp.yibaitao.cn/0d2f4178-7754-4686-9213-b174f745258b.png'
            "
            mode="scaleToFill"
          />
        </view>
      </view>
      <view class="content-item" v-if="productDet.barCode">
        <view class="left">商品条码</view>
        <view class="right">
          <text>{{ productDet.barCode }}</text>
        </view>
      </view>
      <view class="content-item" v-if="productDet.barCode">
        <view class="left">商品</view>
        <view class="right">
          <text>{{ productDet.barCode }}</text>
        </view>
      </view>
      <view class="content-item">
        <view class="left">商品编号</view>
        <view class="right">
          <text>{{ productDet.code }}</text>
        </view>
      </view>
      <view class="content-item">
        <view class="left">归属分类</view>
        <view class="right">
          <text>{{ productDet.categoryName }}</text>
        </view>
      </view>
      <view class="content-item">
        <view class="left">计价方式</view>
        <view class="right">
          <text>{{ productDet.valuationType == 1 ? "计件" : "计重" }}</text>
        </view>
      </view>
      <view class="content-item" v-if="productDet.spec">
        <view class="left">规格</view>
        <view class="right">
          <text>{{ productDet.spec }}</text>
        </view>
      </view>
    </view>
    <view class="content-k">
      <view class="content-item">
        <view class="left">计价单位</view>
        <view class="right">
          <text>{{ productDet.unit || "--" }}</text>
        </view>
      </view>
      <view class="content-item">
        <view class="left">供货价</view>
        <view class="right">
          <text
            v-if="
              (offerPricesSort[0] && offerPricesSort[0].offerPrice) ==
              (offerPricesSort[offerPricesSort.length - 1] &&
                offerPricesSort[offerPricesSort.length - 1].offerPrice)
            "
            >{{ offerPricesSort[0].offerPrice }}</text
          >
          <text
            v-if="
              (offerPricesSort[0] && offerPricesSort[0].offerPrice) !=
              (offerPricesSort[offerPricesSort.length - 1] &&
                offerPricesSort[offerPricesSort.length - 1].offerPrice)
            "
            >{{ offerPricesSort[0].offerPrice }} ~
            {{ offerPricesSort[offerPricesSort.length - 1].offerPrice }}</text
          >
        </view>
      </view>
      <!-- <view class="content-item">
        <view class="left">零售价</view>
        <view class="right">
          <text>{{ productDet.retailPrice || 0 }}</text>
        </view>
      </view> -->
      <view class="content-item">
        <view class="left">最新报价时间</view>
        <view class="right">
          <text>{{ offerPricesList[0] && offerPricesList[0].createTime }}</text>
        </view>
      </view>
    </view>
  </view>

  <!-- <view class="goods_bt">
    <view class="goods_bt_to">
      <button class="bt-qr" @click="showWLFun">修改报价</button>
    </view>
  </view> -->
  <noWork @connected="connected"> </noWork>
</template>

<style lang="scss" scoped>
@import "./index.scss";
</style>
